<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="css/lib/bootstrap.min.css" />
		<script src="js/jquery.min.js"></script>
		<script src="js/lib/bootstrap.min.js"></script>
		<script src="js/lib/vue.min.js"></script>
		<script src="js/lib/vue-resource.js"></script>
		<script src="js/base.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<style>
		td {
			border: 1px solid #eee;
			border-collapse: collapse;
			padding: 5px;
			vertical-align: middle !important;
		}		
		.btn{
			padding:2px 3px;
		}
		#tan{
			width:600px;
			height:400px;
			position:fixed;
			left:200px;
			top:50px;
			background:#000000;
			opacity: 0.8;
			z-index:1000;
			display:none;
		}
		#tantwo{
			width:600px;
			height:500px;
			position:fixed;
			left:200px;
			top:10px;
			background:#000000;
			opacity: 0.8;
			z-index:1000;
			display:none;
		}
		#tanth{
			width:600px;
			height:500px;
			position:fixed;
			left:200px;
			top:10px;
			background:#000000;
			opacity: 0.8;
			z-index:1000;
			display:none;
			border-radius:15px;
			box-shadow:1px 5px 50px 5px ;
		}
		#bbt{
			position:absolute;
			right:0;
			top:0
		}
	</style>
	<body>
		<div class="" id="box" style="position:relative;">		
		<div style="padding:15px 5px 0px 5px;border:.5px solid #ccc;margin-bottom:15px;width:100%;box-shadow:3px 5px 15px">
			<table class="table table-hover" style="float:left;width:52%;">				
				<tbody>
					<tr>
						<th colspan="14" style="font-size:26px;color:#337ab7">管理所有的下级会员：</th>
					</tr>					
					<tr style="font-size:15px;">
						<td colspan="14">
								用户编号：<input class="form-control" style="width:150px;display:inline-block" type="text" name="" id="" v-model="ph" value="" /><button v-on:click="cardno()" class="btn btn-default" style="margin-left:2px;">查询</button>
						</td>										
					</tr>					
					<tr class="text-center" style="font-size:13px;background:#f1f1f1">
						<td style="width:45px">序号</td>
						<td>还款任务</td>
						<td>金额</td>
						<td>费率</td>
						<td>实际金额</td>
						<td>信用卡</td>						
						<td>商户</td>
						<td>状态</td>
						<td>订单号</td>
					</tr>
					<tr class="text-center" v-for="(i,index) in list0">						
						<td style="width:30px">{{index+1}}</td>
						<td>{{i.executionTime}}</td>
						<td>{{i.amount}}</td>
						<td>{{i.rate}}</td>
						<td>{{i.realAmount}}</td>						
						<td>{{i.payCard}}</td>
						<td>{{i.userId}}</td>	
						<td><!-- {{i.status}} -->
							<span v-show="i.status==0">待完成</span>
							<span v-show="i.status==1">成功</span>
							<span v-show="i.status==2">失败</span>
						</td>
						<td>{{i.orderCode}}</td>
					</tr>
					<tr>
						<td style="color:red" colspan="15">
							PS备注信息功能请慎重使用！会即时推送到当前备注用户
						</td>
					</tr>
				</tbody>
			</table>
			<table class="table table-hover" style="float:right;width:48%;">				
				<tbody>
					<tr>
						<th colspan="14" style="font-size:26px;color:#337ab7">管理所有的下级会员：</th>
					</tr>					
					<tr style="font-size:15px;">
						<td colspan="14">
								用户编号：<input class="form-control" style="width:150px;display:inline-block" type="text" name="" id="" v-model="ph" value="" /><button v-on:click="shouji()" class="btn btn-default" style="margin-left:2px;">查询</button>
							
							 	<!-- <input type="date" v-model="star" class="form-control" style="width:150px;display:inline-block">--
								<input type="date" v-model="end" class="form-control" style="width:150px;display:inline-block">
										<button v-on:click="date()" id="date" class="btn btn-default" style="margin-left:20px;">查询</button> -->
						</td>										
					</tr>
					
					<tr class="text-center" style="font-size:13px;background:#f1f1f1">
						<td style="width:45px">序号</td>
						<td>消费任务</td>
						<td>金额</td>
						<td>信用卡</td>						
						<td>商户</td>
						<td>状态</td>
						<td>订单号</td>
					</tr>
					<tr class="text-center" v-for="(i,index) in list">						
						<td style="width:30px">{{index+1}}</td>
						<td>{{i.executionTime}}</td>
						<td>{{i.amount}}</td>						
						<td>{{i.payCard}}</td>
						<td>{{i.userId}}</td>	
						<td><!-- {{i.status}} -->
							<span v-show="i.status==0">出款待完成</span>
							<span v-show="i.status==3">出款成功</span>
							<span v-show="i.status==5">出款失败</span>
						</td>
						<td>{{i.orderCode}}</td>
					</tr>
					<tr>
						<td style="color:red" colspan="15">
							PS备注信息功能请慎重使用！会即时推送到当前备注用户
						</td>
					</tr>
				</tbody>
			</table>		
		</div>
		
		</div>
	</body>

	<script type="text/javascript">
		$(function(){
			var brandid = sessionStorage.getItem(key=3);
			
			/*自定义时间戳*/
		Vue.filter('time', function (value) {//value为13位的时间戳
		    function add0(m) {
		        return m < 10 ? '0' + m : m
		    }
		    var time = new Date(parseInt(value));
		    var y = time.getFullYear();
		    var m = time.getMonth() + 1;
		    var d = time.getDate();		
		    return y + '-' + add0(m) + '-' + add0(d);
		});
	
			/*自定义过滤器*/
		/*自定义过滤器*/	
		Vue.filter("todo2",function(value){
			if(value == 0){
				return value = "未审核"
			}
			if(value == 1){
				return value = "已通过  √"
			}
			if(value == 2){
				return value = "审核失败×"
			}
			if(value == 3){
				return value = "未提交"
			}
		});
	new Vue({
				el:"#box",
				data: {
					list0:[],
					list:[],
					lists:[],
					token:"",
					m1:"",
					m2:"",
					m3:"",
					m4:0,
					s1:"",
					s2:"",
					s3:"",
					s4:"",
					s5:"",
					s6:"",
					ph:"",
					ye:"",
					pages:"",
					page:"",
                    i:"",
					num:"",
					ye1:1,
                    idcade:"",
					card:"",
					star:"",
					end:"",
					ss:[],
					id:""
				},
				created:function(){/*生命周期函数*/
					
				},
				methods:{
				    /*手机号码搜索*/
				    cardno:function(){
				    	console.log(this.ph);
				    	var _this = this;
				    	/*根据手机号码查询用户id*/
				    	$.ajax({
								type:"POST",
								url:window.baseUrl+"user/query/phone",
								async:true,
								data:{
									phone:this.ph
								},
								success:function(data){
									this.id = data.result.id
									console.log(this.id)
									console.log('cg')
									/*获取主线任务*/
								 	$.ajax({
											type:"POST",
											url:window.baseUrl+"paymentchannel/automaticrepaymenttask/findbyuserid",
											async:true,
											data:{
												userId:this.id
											},
											success:function(data){
												/*console.log(data.result)*/
												_this.list0 = data.result;
												console.log(_this.list0);												
											},
											error:function(data){
												console.log(data)
											}
									});
									/*获取子任务*/	
									$.ajax({
											type:"POST",
											url:window.baseUrl+"paymentchannel/spend/findbyuserid",
											async:true,
											data:{
												userId:this.id
											},
											success:function(data){
												/*console.log(data.result)*/
												_this.list = data.result;
												console.log(_this.list);												
											},
											error:function(data){
												console.log(data)
											}
									});
								},
								error:function(data){
									console.log(data)
									console.log('sb')
								}
						});
                        
					},
				   
				   
					/*身份证查询*/
					shen:function(){
						var bid = sessionStorage.getItem(key=3);
                        this.$http.post(window.baseUrl+"user/info/query",{size:100,idcard:this.idcade,brand_id:bid},{emulateJSON:true}).then(
                            function (res){
                                console.log(res)
                                console.log(res.data.result.content)
                                this.list = res.data.result.content;
                                this.pages = res.data.result.totalElememts;
                                console.log(res.data.result.number);
                                this.page  = res.data.result.totalpages;
                                this.num  =  res.data.result.number;

                            },function (res) {
                                console.log(res);
                                alert("查询失败！")
                            }
                        );
					},					
				}
			})			
		})
	</script>
</html>

